<template>
  <el-container class="main_con">
    <div class="list_con">
      <el-table  :data="list" element-loading-text="" fit highlight-current-row>
        <!-- <el-table-column type="selection" width="55" align="center"></el-table-column> -->
        <el-table-column prop="amount" label="佣金额"></el-table-column>
        <el-table-column prop="order_no" label="所属订单"></el-table-column>
        <el-table-column prop="create_time" label="创建时间"></el-table-column>
        <el-table-column prop="status_text" label="状态"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="toOrder(scope.row)">查看订单</el-button>
            <!-- <el-button type="text" @click="handleClose(scope.row.id)">删除</el-button> -->
          </template>
        </el-table-column>
      </el-table>
      <div class="table_footer">
        <div></div>
        <el-pagination @current-change="ChangeCurrent" class="pages" background layout="prev, pager, next" :total="total">
        </el-pagination>
      </div>
    </div>
    <el-dialog title="修改状态" width="400px" :visible.sync="drawer" append-to-body>
      <el-form ref="Form" :model="forms" :label-position="labelPosition" label-width="100px">
        <el-form-item label="分销商">
          <span>{{forms.agent_name}}</span>
        </el-form-item>
        <el-form-item label="创建时间">
          <span>{{forms.agent_name}}</span>
        </el-form-item>
        <el-form-item label="佣金额">
          <span>{{forms.agent_name}}</span>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="forms.status" placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button @click='edit_agent_commission' size="medium">确定</el-button>
        </el-form-item>
      </el-form>

    </el-dialog>
  </el-container>
</template>
<script>
  import {
    agent_commissionlist,
    edit_agent_commission,
  } from '@/api/mall/agent'
  export default {
    name: 'Editcommission',
    data() {
      return {
        list: [],
        total: 0,
        page: 1,
        listLoading: false,
        drawer: false,
        forms: {

        },
        options: [{
            value: 0,
            label: '审核中'
          },
          {
            value: 1,
            label: '审核通过'
          },
          {
            value: 2,
            label: '审核中取消'
          }, {
            value: 3,
            label: '通过后取消'
          },
        ],
        labelPosition: 'left',
      }
    },
    props: {
      agent_id: {
        type: Number,
        default: -1
      }
    },
    watch: {
      agent_id() {
        this.page = 1;
        this.getlist()
      }
    },
    methods: {
      //删除
      handleClose(id) {
        let _this = this
        this.$confirm('确认删除？')
          .then(_ => {
            let data = {
              id: id
            }
            delagent(data).then(res => {
              _this.getlist()
            })
          })
          .catch(_ => {});
      },
      edit_agent_commission() {
        let data = {
          id: this.forms.id,
          update_time: this.forms.update_time,
          status: this.forms.status
        }
        edit_agent_commission(data).then(res => {
          this.getlist()
          this.drawer=false
        })
      },
      //切换页码
      ChangeCurrent(page) {
        this.page = page;
        this.getlist()
      },
      //获取列表
      getlist() {
        this.listLoading = true
        var data = {
          agent_id: this.agent_id
        }
        agent_commissionlist(this.page, data).then(res => {
          var jsondata = res.msg;
          this.list = jsondata.data;
          this.total = jsondata.total
          // this.list = response.data.items
          this.listLoading = false
        })
      },
      EditHandle(data) {
        this.forms = data
        this.drawer = true
      },
      toOrder(item){
          this.$router.push({path:'/agent/order',query:{'order_no':item.order_no}});
      }
    },
    mounted() {
      this.getlist()
    }
  }
</script>

<style scoped>
  .main_con {
    background: #fff;
  }

  .list_con {
    margin: 0;
    padding: 0;
  }

  .el-form-item {
    margin-bottom: 11px;
  }
</style>
